<!DOCTYPE html>
<html lang="en">

	<head>
		<meta charset="utf-8">
		<title>Hogeschool Van Amsterdam - Home</title>
		<link rel="icon" href="../ressources/general/favicon.ico" />
		<link href="../css/a-font-face.css" rel="stylesheet" media="screen">
		<link href="../css/home.css" rel="stylesheet" media="screen">
	</head>

	<body>

		<div id="top">
			<div id="top-left">
				HOGESCHOOL VAN AMSTERDAM
			</div>
			<nav id="colorNav">
				<ul>
					<li class="green">
						<a href="#" class="icon-home">GROUPS <span class="notif">(3)</span></a>
						<ul>
							<li><a href="groups.html">Student X add you in a new group</a></li>
							<li><a href="groups.html">Student Y settle a new deadline</a></li>
							<li><a href="groups.html">Student Z upload a new file</a></li>
							<!-- More dropdown options -->
						</ul>
					</li>
					<li class="green">
						<a href="#" class="icon-home">HOMEWORK <span class="notif">(4)</span></a>
						<ul>
							<li><a href="homework.html">You have 1 new homework in Entrepreneurship</a></li>
							<li><a href="homework.html">You have 1 new homework in Personal Leadership</a></li>
							<li><a href="homework.html">You have 3 new homework in International Money & Finance</a></li>
							<li><a href="homework.html">You have 2 new homework in Debating in English</a></li>
							<!-- More dropdown options -->
						</ul>
					</li>
					<li class="green">
						<a href="#" class="icon-home">MESSAGES <span class="notif">(2)</span></a>
						<ul>
							<li><a href="messages.html">Student X send you a message</a></li>
							<li><a href="messages.html">Student Y send you a message</a></li>
							<!-- More dropdown options -->
						</ul>
					</li>
					<li class="green">
						<a href="#" class="icon-home">OTHERS <span class="notif">(2)</span></a>
						<ul>
							<li><a href="#">Teacher A is absent today</a></li>
							<li><a href="calendar_week.html">Schedule modification for your Financial Trade course</a></li>
							<!-- More dropdown options -->
						</ul>
					</li>
					<li class="green">
						<a href="#" class="icon-home">Student X</a>
						<ul>
							<li><a href="#">My profile</a></li>
							<li><a href="#">My marks</a></li>
							<li><a href="../index.html">Disconnect</a></li>
							<!-- More dropdown options -->
						</ul>
					</li>
				</ul>
			</nav>
		</div>

		<div id="page">

			<div id="header">
				<ul id="menu">
					<a href="home.html">
						<li class="list_menu">
							<div class="list_menu_active" id="list_menu_home">
								HOME
							</div>
						</li>
					</a>
					<a href="calendar.html">
						<li class="list_menu">
							<div class="list_menu_container" id="list_menu_calendar">
								CALENDAR
							</div>
						</li>
					</a>
					<a href="homework.html">
						<li class="list_menu">
							<div class="list_menu_container" id="list_menu_homework">
								HOMEWORK
							</div>
						</li>
					</a>
					<a href="files.html">
						<li class="list_menu">
							<div class="list_menu_container" id="list_menu_files">
								FILES
							</div>
						</li>
					</a>
					<a href="groups.html">
						<li class="list_menu">
							<div class="list_menu_container" id="list_menu_groups">
								GROUPS
							</div>
						</li>
					</a>
					<a href="messages.html">
						<li class="list_menu">
							<div class="list_menu_container" id="list_menu_messages">
								MESSAGES
							</div>
						</li>
					</a>
				</ul>
			</div>

			<div id="options">
				<div id="options_left">
					<a href="#" class="button">Propose an article</a>
				</div>
				<div id="options_right">
				</div>
			</div>

			<div id="nav">
				<ul>
					<lh>ARTICLES</lh>
					<hr>
					<li><a href="#">Hot Articles</a></li>
					<li><a href="#">More Popular</a></li>
					<li><a href="#">More Commented</a></li>
					<li><a href="#">Random Articles</a></li>
				<ul>
				<ul>
					<lh>USEFULL</lh>
					<hr>
					<li><a href="#">New Student</a></li>
					<li><a href="#">International</a></li>
					<li><a href="#">Accomodations</a></li>
					<li><a href="#">Library</a></li>
					<li><a href="#">Computing</a></li>
					<li><a href="#">Cafetaria</a></li>
				<ul>
				<ul>
					<lh>CONTACT</lh>
					<hr>
					<li><a href="#">Administration</a></li>
					<li><a href="#">Teachers</a></li>
					<li><a href="#">IT Team</a></li>
					<li><a href="#">Student Network</a></li>
					<li><a href="#">Others</a></li>
				<ul>
			</div>

			<div id="content">
				<div class="article_left" id="article">
					<h2>ACREDITATIONS EPAS</h2>
					<h1>How to get credited with the EPAS requirement</h1>
					<h3>By <span>Admin</h3>
					<hr>
					<div class="infos">
						<img class="icon_infos" src="../ressources/home/date.png"/>
						<span class="infos_items">February 15th, 2013</span>
						<img class="icon_infos" src="../ressources/home/tags.png"/>
						<span class="infos_items">EPAS, CREDITS</span>
						<img class="icon_infos" src="../ressources/home/comments.png"/>
						<span class="infos_items">3 Comments</span>
					</div>
					<img src="../ressources/home/image_article.png"/>
					<p class="description">Lorem ipsum dolor sit amet, consectetur adipiscing elit.Pellentesque ultricies, urna vitae fringilla faucibus, orci tortor condimentum purus, sed commodo lorem mauris eget enim. Donec et metus arcu, ut porta eros. Morbi adipiscing tellus vel risus ultrices tristique hendrerit vel augue. Donec imperdiet vehicula dui, ut semper lacus facilisis in.</p>
					<a href="#" class="button">Read more</a>
				</div>
				<div class="article_right" id="article">
					<h2>ACREDITATIONS EPAS</h2>
					<h1>How to get credited with the EPAS requirement</h1>
					<h3>By <span>Admin</h3>
					<hr>
					<div class="infos">
						<img class="icon_infos" src="../ressources/home/date.png"/>
						<span class="infos_items">February 15th, 2013</span>
						<img class="icon_infos" src="../ressources/home/tags.png"/>
						<span class="infos_items">EPAS, CREDITS</span>
						<img class="icon_infos" src="../ressources/home/comments.png"/>
						<span class="infos_items">3 Comments</span>
					</div>
					<img src="../ressources/home/image_article.png"/>
					<p class="description">Lorem ipsum dolor sit amet, consectetur adipiscing elit.Pellentesque ultricies, urna vitae fringilla faucibus, orci tortor condimentum purus, sed commodo lorem mauris eget enim. Donec et metus arcu, ut porta eros. Morbi adipiscing tellus vel risus ultrices tristique hendrerit vel augue. Donec imperdiet vehicula dui, ut semper lacus facilisis in.</p>
					<a href="#" class="button">Read more</a>
				</div>
				<div class="article_left" id="article">
					<h2>ACREDITATIONS EPAS</h2>
					<h1>How to get credited with the EPAS requirement</h1>
					<h3>By <span>Admin</h3>
					<hr>
					<div class="infos">
						<img class="icon_infos" src="../ressources/home/date.png"/>
						<span class="infos_items">February 15th, 2013</span>
						<img class="icon_infos" src="../ressources/home/tags.png"/>
						<span class="infos_items">EPAS, CREDITS</span>
						<img class="icon_infos" src="../ressources/home/comments.png"/>
						<span class="infos_items">3 Comments</span>
					</div>
					<img src="../ressources/home/image_article.png"/>
					<p class="description">Lorem ipsum dolor sit amet, consectetur adipiscing elit.Pellentesque ultricies, urna vitae fringilla faucibus, orci tortor condimentum purus, sed commodo lorem mauris eget enim. Donec et metus arcu, ut porta eros. Morbi adipiscing tellus vel risus ultrices tristique hendrerit vel augue. Donec imperdiet vehicula dui, ut semper lacus facilisis in.</p>
					<a href="#" class="button">Read more</a>
				</div>
				<div class="article_right" id="article">
					<h2>ACREDITATIONS EPAS</h2>
					<h1>How to get credited with the EPAS requirement</h1>
					<h3>By <span>Admin</h3>
					<hr>
					<div class="infos">
						<img class="icon_infos" src="../ressources/home/date.png"/>
						<span class="infos_items">February 15th, 2013</span>
						<img class="icon_infos" src="../ressources/home/tags.png"/>
						<span class="infos_items">EPAS, CREDITS</span>
						<img class="icon_infos" src="../ressources/home/comments.png"/>
						<span class="infos_items">3 Comments</span>
					</div>
					<img src="../ressources/home/image_article.png"/>
					<p class="description">Lorem ipsum dolor sit amet, consectetur adipiscing elit.Pellentesque ultricies, urna vitae fringilla faucibus, orci tortor condimentum purus, sed commodo lorem mauris eget enim. Donec et metus arcu, ut porta eros. Morbi adipiscing tellus vel risus ultrices tristique hendrerit vel augue. Donec imperdiet vehicula dui, ut semper lacus facilisis in.</p>
					<a href="#" class="button">Read more</a>
				</div>
				<div class="article_left" id="article">
					<h2>ACREDITATIONS EPAS</h2>
					<h1>How to get credited with the EPAS requirement</h1>
					<h3>By <span>Admin</h3>
					<hr>
					<div class="infos">
						<img class="icon_infos" src="../ressources/home/date.png"/>
						<span class="infos_items">February 15th, 2013</span>
						<img class="icon_infos" src="../ressources/home/tags.png"/>
						<span class="infos_items">EPAS, CREDITS</span>
						<img class="icon_infos" src="../ressources/home/comments.png"/>
						<span class="infos_items">3 Comments</span>
					</div>
					<img src="../ressources/home/image_article.png"/>
					<p class="description">Lorem ipsum dolor sit amet, consectetur adipiscing elit.Pellentesque ultricies, urna vitae fringilla faucibus, orci tortor condimentum purus, sed commodo lorem mauris eget enim. Donec et metus arcu, ut porta eros. Morbi adipiscing tellus vel risus ultrices tristique hendrerit vel augue. Donec imperdiet vehicula dui, ut semper lacus facilisis in.</p>
					<a href="#" class="button">Read more</a>
				</div>
				<div class="article_right" id="article">
					<h2>ACREDITATIONS EPAS</h2>
					<h1>How to get credited with the EPAS requirement</h1>
					<h3>By <span>Admin</h3>
					<hr>
					<div class="infos">
						<img class="icon_infos" src="../ressources/home/date.png"/>
						<span class="infos_items">February 15th, 2013</span>
						<img class="icon_infos" src="../ressources/home/tags.png"/>
						<span class="infos_items">EPAS, CREDITS</span>
						<img class="icon_infos" src="../ressources/home/comments.png"/>
						<span class="infos_items">3 Comments</span>
					</div>
					<img src="../ressources/home/image_article.png"/>
					<p class="description">Lorem ipsum dolor sit amet, consectetur adipiscing elit.Pellentesque ultricies, urna vitae fringilla faucibus, orci tortor condimentum purus, sed commodo lorem mauris eget enim. Donec et metus arcu, ut porta eros. Morbi adipiscing tellus vel risus ultrices tristique hendrerit vel augue. Donec imperdiet vehicula dui, ut semper lacus facilisis in.</p>
					<a href="#" class="button">Read more</a>
				</div>
			</div>

			<div id="pagination">
				<a href="#">1</a>
				<a href="#">2</a>
				<a href="#">3</a>
				<a href="#">4</a>
				<a href="#">5</a>
				<a href="#">6</a>
				<a href="#">7</a>
				<a href="#">8</a>
				<a href="#">...</a>
				<a href="#">27</a>
			</div>

		</div>

	</body>
</html>
